CSS'TE Tabloyu Nasıl Güzelleştirebilirim?
28.07.2023 - 11:33
CSS İle bu tabloyu güzelleştirmeye çalışıyorum. ne yapsam hiçbiri çalışmıyor ne yapabilirim?
152
Görüntülenme
0 Beğeni
Baha Baltacı
10 GY Puanı
02 Ağustos 2023
Tarihinde Güncellendi
Soru & Cevap
sirimukaddes
13.12.2024 - 10:53
Merhaba,
Css ile ilk başta tabloya ve tablo elemanlarına genel stil tanımlaması yapabilirsin. Örneğin;
table {
width:100%;
}
th,td {
padding: 4px; /* Hücrelere boşluk ekler */
text-align: left; /* Hücre içinde yer alan metinleri sola yaslar */
border: 1px solid #ddd; /* Hücrelerin etrafına 1px genişliğinde düz kenarlık ekler */
}
Bir diğer şey CSS ile odd ve even kullanılarak tek ve çift satırlara farklı stiller verebilirsin. Örneğin;
tr:nth-child(even) {
background-color: #ccc; /* Çift satırlara arka plan regni */
}
tr:nth-child(odd) {
background-color: #eee; /* Tek satırlara arka plan rengi */
}Bir diğer konu tablonun tüm cihazlarda uyumlu olarak gözükmesi için CSS üzerinde Responsive olarak kodlamasını yapabilirsin.
mkosece87
27.02.2024 - 08:19
Renk seçimi ve arka plana web sitesiyle uyumlu renkler seçmek ( eğer aklında bişey yoksa hazır renk paletlerini internetten bulup sayfanda kullanabilirsin ), kenarlıklar , yazı stili , hücre yüksekliği ve genişliği gibi unsurları tablonun da içeriğiyle uyumlu olacak şekilde ayarlayarak güzelleştirebilirsin ve farklı tabloları ID ve classlarına göre farklı şekillerde tasarlayabilirsin.
ardakoca957
12.08.2023 - 07:49
Başlıklara ve liste elemanlarına padding,yazı fontu vs. verebilirsin.
furkanulutas
10.08.2023 - 04:17
Doğru class ve id isimlendirmelerini yaptığından ve İlgili css dosyasını import ettiğinden emin misin?
ykpcrr
09.08.2023 - 11:14
yani style.css (stil düzenlemeni yaptığın dosyan adı farklı olabilir ama .css olmalı) dosyasını html dosyana eklememiş olabilirsin
<head> tagleri arasında <link href: "style.css"> diyerek css dosyanı ekleyebilirsin
xkaanr
08.08.2023 - 12:26
Bootstrap Kullan Pek Design Bilgi Yoksa
cabirtumer
06.08.2023 - 09:16
<table> etiketi çok eski bir etikettir uzun süredir bu iştwyim ve kimsenin kullandığını görmedim onun yerine <div> yahut <ul>
<ol> gibi etiketer kullanıp daha dinamik bir görünüş elde edebilirsiniz
singect
06.08.2023 - 08:24
- head içerisine "<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">" Ekle
2. https://getbootstrap.com/docs/4.1/content/tables/ bu linke de göz atabilirsin
hakanyqmr
05.08.2023 - 12:46
<table> <tr> <td>... içerik ...</td> </tr> </table>
Bu şekilde table içerisine alarak biraz da zevke uygun renk katarak güzellik katabilirsin
sibeldemir
05.08.2023 - 11:03
Tabloyu buttonlar ve ikonlar aracığıyla daha güzel hale getirebilirsiniz. paylaş yazmak yerine paylaş ikonu koyabilirsiniz mesela
muhammedkuzu
04.08.2023 - 01:07
Merhabalar,
Html etiketlerini, class veya id'leri seçerken doğru seçtiğinize emin misiniz? Css kodlarınız tamamen mi çalışmıyor. Yada sadece tabloyu biçimlendirirken mi sıkıntı yaşıyorsunuz? Sorunu daha detaylı açıklarsanız daha iyi yardımcı olmaya çalışabilirim.
akifdora
03.08.2023 - 10:33
Merhaba Baha,
Çalıştığın HTML sayfasında CSS bağlantısının doğru olduğuna emin ol.
CSS'te etiketlere göre ya da class isimlerine göre özelleştirmeler yapabilirsin.